import React, { useMemo } from 'react';
import './index.less';
import Title from 'components/title';
import { Space, List, Button } from 'antd';
import { IHistory } from '../types';
interface IProps {
    data: IHistory[];
    setHistorys: Function
}
export default React.memo((props: IProps) => {
    console.log('history', props);
    const clear = () => {
        props.setHistorys([])
    }
    return (
        <Space className="home-history" direction="vertical" size={20}>
            <div className="flex-between">
                <Title text="记录" />
                <Button type="link" onClick={clear}>清除记录</Button>
            </div>
            <List
                itemLayout="vertical"
                dataSource={props.data}
                style={{ height: 600, overflowY: 'auto' }}
                renderItem={(item) => (
                    <List.Item>
                        <div>{item.time}</div>
                        <img src={item.data} style={{ width: '100%', height: 'auto' }} alt="" />
                    </List.Item>
                )}
            ></List>
        </Space>
    );
});
